import React, { Component } from 'react'
import { NavContainer } from './navs.style'
import { Grid } from 'antd-mobile';
import nav1 from 'assets/icon/nav (1).png'
import nav2 from 'assets/icon/nav (2).png'
import nav3 from 'assets/icon/nav (3).png'
import nav4 from 'assets/icon/nav (4).png'
import nav5 from 'assets/icon/nav (5).png'
import nav6 from 'assets/icon/nav (6).png'
import nav7 from 'assets/icon/nav (7).png'
import nav8 from 'assets/icon/nav (8).png'


/* const data = Array.from(new Array(9)).map((_val, i) => ({
    icon: 'https://gw.alipayobjects.com/zos/rmsportal/nywPmnTAvTmLusPxHPSu.png',
    text: `name${i}`,
})); */



export default class navs extends Component {
constructor() {
    super();
    this.state={
        data:[
            {
            icon: nav1,
            text: `模式`,
            },
            {
            icon: nav2,
            text: `验证`,
            },
            {
            icon: nav3,
            text: `评分`,
            },
            {
            icon: nav4,
            text: `信息`,
            },
            {
            icon: nav5,
            text: `直播`,
            },
            {
            icon: nav6,
            text: `设置`,
            },
            {
            icon: nav7,
            text: `手机`,
            },
            {
            icon: nav8,
            text: `商城`,
            },
            
            
    ]
    }
}

    prevent(e) {
        e.stopPropagation();
    }
    render() {
        return (
            <NavContainer show={this.props.show} onClick={(e) => this.prevent(e)}>
               <Grid data={this.state.data} activeStyle={false} columnNum={4}  />
               
            </NavContainer>
        )
    }
}
